<template>
  <el-dialog title="查看脑图" :visible.sync="showDialog" width="90%" style="height:800px" :destroy-on-close="true" :close-on-click-modal="false">
    <div id="chart" style="width:100%;height:500px;"></div>
  </el-dialog>
</template>

<script>
import { getBrainMap } from '@/api/common'
export default {
  name: 'brainMap',
  props:{
    selectItem:{
      type:Object,
      defalut:{}
    }
  },
  data() {
    return {
      showDialog:false
    };
  },
  methods: {
    initPage(opt){
      getBrainMap({
        id:opt.id,
        parentType:opt.type
      }).then(res=>{
        let myChart = this.$echarts.init(document.getElementById('chart'));
        myChart.clear();
        var data2 = res.data.result;
        if(data2.length == 0) return false;
         setTimeout(function(){
           myChart.setOption({
            tooltip: {
              trigger: 'item',
              triggerOn: 'mousemove'
            },
            legend: {
              top: '2%',
              left: '3%',
              orient: 'vertical',
              data: [],
              borderColor: '#c23531'
            },
            series: [
              {
                type: 'tree',
                name: 'tree2',
                initialTreeDepth:10,
                data: [data2.length !=0 ?data2[0]:null],
                top: '1%',
                left: '10%',
                bottom: '1%',
                right: '20%',
                symbolSize: 7,
                label: {
                    position: 'left',
                    verticalAlign: 'middle',
                    align: 'right',
                    fontSize: 10
                },

                leaves: {
                    label: {
                        position: 'right',
                        verticalAlign: 'middle',
                        align: 'left'
                    }
                },

                expandAndCollapse: true,

                emphasis: {
                  focus: 'descendant'
                },
              }
            ]
          });
         },300)
      })
      
     
    }
  },
  mounted() {
  
  }
};
</script>

<style lang="scss" scoped>

</style>
